{extend name="index_layout"/}
{block name="main"}
<form class="layui-form" method="post">
    <table class="layui-table" id="tt">
        <thead>
            <tr>
                <th>不良品项</th>
                <th>数量</th>
            </tr>
        </thead>
        <tbody>
            {volist name="badList" id="item"}
            <tr>
                <td>{$item.title}</td>
                <td>
                    <input type="text" class="change" name="nums[]">
                    <input type="hidden" class="ids" name="ids[]" value="{$item.id}">
                    <input type="hidden" class="title" name="title[]" value="{$item.title}">
                </td>
            </tr>
            {/volist}
        </tbody>
    </table>
    <div id="jsondata2" style="display: none;"></div>
</form>

{/block}

{block name="script"}
<script>
    $(function(){
        setTimeout(() => {
            var jsondata2 = $('#jsondata2').html();
            console.log(jsondata2);
            if(jsondata2){
                jsondata2 = JSON.parse(jsondata2);
                var _html = '';
                for(var i in jsondata2){
                    _html += '<tr><td>'+jsondata2[i].title+'</td><td>'+
                            '<input type="text" class="change" value="'+jsondata2[i].nums+'" name="nums[]">'+
                            '<input type="hidden" class="ids" name="ids[]" value="'+jsondata2[i].id+'">'+
                            '<input type="hidden" class="title" name="title[]" value="'+jsondata2[i].title+'">'+
                        '</td>';
                }
                $('#tt').find('tbody').html(_html);
            }
            
        }, 500);
    })
    layui.use(['form','yznForm'], function() {
        var form = layui.form;
        var yznForm = layui.yznForm
        form.on('select(findProductName)',function(data){
            $.post('{:url("findProductName")}',{id:data.value},function(res){
                $('.product_name').val(res.title)
            })
        })
        var yznForm = layui.yznForm;
        yznForm.listen();
        var param = [];
        setTimeout(() => {
            $('input[name="ids[]"]').each(function(){
                param.push({id:$(this).val(),title:$(this).siblings('input[name="title[]"]').val(),'nums':$(this).siblings('input[name="nums[]"]').val()});
            })
        }, 600);
        console.log(param);
        // var param = [];
        var ids = [];
        $('body').on('input','.change',function(){
            var id = $(this).siblings('.ids').val();
            var title = $(this).siblings('.title').val();
            var obj = {id:id,nums:$(this).val(),title:title};
            // if(ids.indexOf(id) !== -1){  
                for(var i in param){
                    if(param[i].id == id){
                        param[i] = obj;
                    }
                }
            // }else{
                // param.push(obj);
                // ids.push(id);
            // }
            console.log(param);
            $('#jsondata2').html(JSON.stringify(param));
        })
        // form.on('submit(ds)',function(data){
        //     var param = data.field;
        //     $.post('{:url("editPost")}',param,function(res){
        //         if(res.code > 0){
        //             layer.msg('添加成功');
        //             setTimeout(() => {
        //                 var index1 = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
        //                 parent.layer.close(index1);
        //                 parent.location.reload();
        //             }, 500);
        //         }else{
        //             layer.msg(res.msg);
        //         }
        //     },'json');
        // })
    })
</script>
{/block}